<template>
	<view>
		<swiper class="swiper"  :indicator-dots="true" :autoplay="true" :interval="1000" :duration="1000" circular>
			<swiper-item v-for="(item,index) in swiperArr" :key="index">
				<image :src="item.src" mode="" class="swiper-item"></image>
			</swiper-item>
		</swiper>
		<view class="goodsson" v-for="item in infoArr" :key="item.id" @click="nav(item.id)">
			<view class="one">
				<view class="price">
					<view>¥{{item.sell_price}}</view>
					<view>¥{{item.market_price}}</view>
				</view>
				<view class="title">{{item.title}}</view>
			</view>
			<view class="two">
				<view class="">
					货号:&nbsp;&nbsp;{{item.goods_no}}
				</view>
				<view class="">
					库存:&nbsp;&nbsp;{{item.stock_quantity}}
				</view>
			</view>
		</view>
		<view class="desc" v-for="(item,index) in descArr " :key='index'>
			<view class="descson">
				详情介绍
				<view class="content" v-html="item.content">
					
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				swiperArr:[],
				infoArr:[],
				descArr:[]
			}
		},
		onLoad(option) {
			console.log(option.id)
			this.id=option.id
			this.getswiper()
			this.getinof()
			this.getdesc()
		},
		methods: {
			async getswiper(){
				const data =await uni.$http.get(`/getthumimages/${this.id}`)
				// console.log(data)
				this.swiperArr=data.message
			},
			async getinof(){
				const data =await uni.$http.get(`/goods/getinfo/${this.id}`)
				// console.log(data)
				this.infoArr=data.message
			},
			async getdesc(){
				const data =await uni.$http.get(`/goods/getdesc/${this.id}`)
				console.log(data)
				this.descArr=data.message
			}
		}
	}
</script>

<style>
	page{
		width: 750rpx;
		
	}
.swiper{
	height: 700rpx;
}
.swiper-item{
	width: 100%;
}
.one{
	border-bottom: 7px solid #ECECEC;
}
.two{
	border-bottom: 7px solid #ECECEC;
}
.two>view{
	height: 70rpx;
	line-height: 70rpx;
}
.goodsson {
	box-sizing: border-box;
	/* height: 150rpx; */
}

.goodsson>image {
	height: 60%;
	width: 80%;
}

.price {
	margin-left: 10rpx;
	display: flex;
	align-items: flex-end;
}

.price :nth-child(1) {
	color: red;
	font-size: 20px;
	margin-right: 20rpx;
}

.price :nth-child(2) {
	color: #8F8F94;
	text-decoration: line-through;
}

.title {
	margin: 10rpx;
}
.gomeImgLoad{
	width: 100%;
}
</style>
